<div class="bottom-menu" [class.bottom-menu-in-use]="!hideDeleteBtn">
  <div class="bottom-menu__header">
    <input
      class="inputText"
      type="text"
      [placeholder]="placeholderAddTask"
      (focus)="onFocus()"
      (blur)="onBlur()"
      (input)="onChange($event.target)"
      [class.inputText-in-use]="!hideDeleteBtn"
    />
    <button
      class="deleteBtn"
      (click)="clearInput($event.target)"
      [hidden]="hideDeleteBtn"
    >
      <mat-icon>close</mat-icon>
    </button>
    <button
      class="button-class"
      aria-label="Меню"
      [hidden]="hideMenuBtn"
    >Menu
    </button>
  </div>

  <div
    [hidden]="hideTaskBtns"
    class="bottom-menu__btns"
  >
    <button class="icon-btn">
      <mat-icon>menu</mat-icon>
    </button>
    <button class="icon-btn">
      <mat-icon>calendar_today</mat-icon>
    </button>
    <button class="icon-btn">
      <mat-icon>cached</mat-icon>
    </button>
    <button class="icon-btn">
      <mat-icon>check</mat-icon>
    </button>
  </div>
</div>
